<form class="layui-form layui-box" style='padding:25px 30px 20px 0' action="{:url()}" data-auto="true" method="post">

    <div class="layui-form-item">
        <label class="layui-form-label">广告位</label>
        <div class="layui-input-block">
            <input type="text" name="name" value='{$spot.name}' disabled class="layui-input">
        </div>
    </div>

    <div class="layui-form-item">
        <label class="layui-form-label">广告名称</label>
        <div class="layui-input-block">
            <input type="text" name="name" value='{$vo.name|default=""}' required="required" title="请输入广告位名称" placeholder="请输入广告位名称" class="layui-input">
        </div>
    </div>

    <div class="layui-form-item">
        <label class="layui-form-label">广告图片</label>
        <div class="layui-input-block">
            <div class="row nowrap">
                <div class="col-xs-3">
                    <div class="upload-image-box">
                        <section class="image-center" style="background-image:url('{$vo.image|default=$image}')"></section>
                        <input value="{$vo.image|default=$image}" type="hidden" name="image">
                    </div>
                </div>
                <div class="col-xs-6">
                    <a data-file="one" data-type="jpg,png,jpeg" data-field="image" class="btn btn-sm">上传图片</a>
                </div>
            </div>

            <p class="help-block" style="margin-top:10px;color:#ccc;font-size: 12px;">图片建议尺寸：640像素 * 360像素</p>
        </div>
    </div>
    <div class="layui-form-item">
        <label class="layui-form-label">排序</label>
        <div class="layui-input-block">
            <input type="text" name="sort" value='{$vo.sort|default=""}' required="required" title="请输入广告位名称,排序小的在前面" placeholder="请输入广告位名称" class="layui-input">
        </div>
    </div>
    <div class="layui-form-item">
        <label class="layui-form-label">广告链接</label>
        <div class="layui-input-block">
            <input type="text" name="link" value='{$vo.link|default=""}'  title="请输入广告链接" placeholder="请输入广告链接" class="layui-input">
        </div>
    </div>

    <div class="hr-line-dashed"></div>
    <div class="layui-form-item">
        <div class="layui-input-block">
            <p> 医院列表 ：/pages/personal/personal</p>
            <p> 体检报告 ：/pages/report/report</p>
            <p> 医院详情 ：/pages/peoples/peoples?id=医院id</p>
            <p> 套餐详情 ：/pages/hospital/hospital?id=套餐id</p>
            <p> 团检内容 ：/pages/appointment/appointment</p>
            <p> 文章详情 ：/pages/details/details?id=文章id&type=1 或 ?msg_id=文章id</p>
        </div>
    </div>
    <div class="layui-form-item text-center">
        <input type="hidden" name="spot_id" value="{$spot.id}"/>
        {if isset($vo['id'])}<input type='hidden' value='{$vo.id}' name='id'/>{/if}
        <button class="layui-btn" type='submit'>保存数据</button>
        <button class="layui-btn layui-btn-danger" type='button' data-confirm="确定要取消编辑吗？" data-close>取消编辑</button>
    </div>

</form>

<script>
    $(document).ready(function() {
        $('body').on('change', '.upload-image-box input', function () {
            $('.news-item.active').css('background-image', 'url(' + this.value + ')');
            $(this).parent().children('.image-center').css('background-image', 'url(' + this.value + ')');
        });
    })
</script>
